.fourh1xAn{
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
    -o-animation-fill-mode: both;

    animation: fourh1xinkey .5s linear;

     /* Safari */
     -webkit-animation: fourh1xinkey .5s linear;
     /* Firefox */
     -moz-animation: fourh1xinkey .5s linear;
      /* IE 9 */
     -ms-zoom-animation: fourh1xinkey .5s linear;
     /* Opera */
     -o-animation: fourh1xinkey .5s linear;
}
@keyframes fourh1xinkey {
    0%{
        opacity: 0;
        transform: translateX(-100px);
    }
    100%{
        opacity: 1;
        transform: translateX(0);
    }
}
@-webkit-keyframes fourh1xinkey {
    0%{
        opacity: 0;
        -webkit-transform: translateX(-100px);
    }
    100%{
        opacity: 1;
        -webkit-transform: translateX(0);
    }
}

.fourh1nAn{
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
    -o-animation-fill-mode: both;

    animation: fourh1niangkey .5s linear;

    /* Safari */
    -webkit-animation: fourh1niangkey .5s linear;
    /* Firefox */
    -moz-animation: fourh1niangkey .5s linear;
     /* IE 9 */
    -ms-zoom-animation: fourh1niangkey .5s linear;
    /* Opera */
    -o-animation: fourh1niangkey .5s linear;
}
@keyframes fourh1niangkey {
    0%{
        opacity: 0;
        transform: translateX(100px);
    }
    100%{
        opacity: 1;
        transform: translateX(0);
    }
}
@-webkit-keyframes fourh1niangkey {
    0%{
        opacity: 0;
        -webkit-transform: translateX(100px);
    }
    100%{
        opacity: 1;
        -webkit-transform: translateX(0);
    }
}

/* <h2>the bride 新娘</h2> */
.fourh2An{
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
    -o-animation-fill-mode: both;

    animation: fourh2key .5s linear;
     /* Safari */
     -webkit-animation: fourh2key .5s linear;
     /* Firefox */
     -moz-animation: fourh2key .5s linear;
      /* IE 9 */
     -ms-zoom-animation: fourh2key .5s linear;
     /* Opera */
     -o-animation: fourh2key .5s linear;
}
@keyframes fourh2key {
    0%{
        opacity: 0;
        transform: translateX(100px);
    }
    100%{
        opacity: 1;
        transform: translateX(0);
    }
}
@-webkit-keyframes fourh2key {
    0%{
        opacity: 0;
        -webkit-transform: translateX(100px);
    }
    100%{
        opacity: 1;
        -webkit-transform: translateX(0);
    }
}

/* <h4>只愿君心似我心，定不负相思意。</h4> */
.fourh4An{
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
    -o-animation-fill-mode: both;

    animation: fourh4key .5s linear;

    /* Safari */
    -webkit-animation: fourh4key .5s linear;
    /* Firefox */
    -moz-animation: fourh4key .5s linear;
     /* IE 9 */
    -ms-zoom-animation: fourh4key .5s linear;
    /* Opera */
    -o-animation: fourh4key .5s linear;
}
@keyframes fourh4key {
    0%{
        opacity: 0;
        transform: translateY(50px);
    }
    100%{
        opacity: 1;
        transform: translateY(0);
    }
}
@-webkit-keyframes fourh4key {
    0%{
        opacity: 0;
        -webkit-transform: translateY(50px);
    }
    100%{
        opacity: 1;
        -webkit-transform: translateY(0);
    }
}